<template>
	<view class="box">
		<view class="swiper-img">
			<u-swiper :list="listImg" radius="0" height="250"></u-swiper>
		</view>
		<view class="center">
			<view class="user">
				<view class="left">
					<view class="">
						<u--image src="https://cdn.uviewui.com/uview/album/1.jpg" shape="circle" width="40"
							height="40"></u--image>
					</view>
					<view class="left-title">
						<view class="">
							微信用户
						</view>
						<view class="vip">
							VIP1
						</view>
					</view>
				</view>

				<view class="right">
					<view class="right-content">
						<view class="right-title">
							<view class="">
								50
							</view>
							<view class="">
								积分
							</view>
						</view>
						<view class="right-title">
							<view class="">
								0
							</view>
							<view class="">
								余额
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 自取/外卖 -->
			<view class="way">
				<view class="way-box">
					<view class="left-way">
						<view class="way-title">
							自取
						</view>
						<view class="way-text">
							下单免排队
						</view>
					</view>
					<view class="right-way">
						<view class="way-title">
							外卖
						</view>
						<view class="way-text">
							新鲜送上门
						</view>
					</view>
				</view>
			</view>
			<!-- 图标 -->
			<view class="icon-box">
				<view class="icon-content">
					<view class="icon-img">
						<u--image src="https://cdn.uviewui.com/uview/swiper/1.jpg" shape="circle" width="40"
							height="40"></u--image>
					</view>
					<view class="icon-name">
						储值有礼
					</view>
				</view>
				<view class="icon-content">
					<view class="icon-img">
						<u--image src="https://cdn.uviewui.com/uview/album/1.jpg" shape="circle" width="40"
							height="40"></u--image>
					</view>
					<view class="icon-name">
						邀请有礼
					</view>
				</view>
				<view class="icon-content">
					<view class="icon-img">
						<u--image src="https://cdn.uviewui.com/uview/swiper/1.jpg" shape="circle" width="40"
							height="40"></u--image>
					</view>
					<view class="icon-name">
						企微9.9元
					</view>
				</view>
				<view class="icon-content">
					<view class="icon-img">
						<u--image src="https://cdn.uviewui.com/uview/album/1.jpg" shape="circle" width="40"
							height="40"></u--image>
					</view>
					<view class="icon-name">
						积分商城
					</view>
				</view>
			</view>
			<!-- 其他 -->
			<view class="other">
				<u--image :src="swiper1" width="100%" radius="10"></u--image>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { ref } from 'vue'
	import swiper1 from '../../static/images/imgs/b1.jpeg'
	import swiper2 from '../../static/images/imgs/b2.jpeg'
	import swiper3 from '../../static/images/imgs/b3.jpeg'

	const listImg = ref([swiper1, swiper2, swiper3])
</script>
<style lang="scss" scoped>
	@import '~@/pages/index/index.scss';
</style>